<template>
  <div>
    <div class="main">
      <button @click="clickMethod">between</button>
      <button @click="clickMethod">time2second</button>
      <button @click="clickMethod">second2time</button>
      <button @click="clickMethod">newDate</button>
      <button @click="clickMethod">now</button>
    </div>
    <h1>{{ msg }}</h1>
  </div>
</template>

<script>
import icewood from 'icewood'
export default {
  // eslint-disable-next-line 
  name: 'IcewoodTag',
  data() {
    return {
      msg: ' ',

    }
  },
  methods: {
    clickMethod(e) {
      const name = e.target.innerText
      let res = ''
      switch (name) {
        case 'between': res = icewood.between("Hello, World!", ",", "!"); break;
        case 'time2second': res = icewood.time2second("01:02:03"); break;
        case 'second2time': res = icewood.second2time(3601); break;
        case 'newDate': res = icewood.newDate("2020-01-01"); break;
        case 'now': res = icewood.now(); break;
      }
      this.msg = res
      console.log(name, '：', res);
    }
  },
}
</script>


<style scoped>
.main {
  display: flex;
  justify-content: space-around;
}
button {
  padding: 9px 15px;
  border-radius: 3px;
  background-color: #2f85f5;
  color: #fff;
  border-color: #0e6ded;
  border: 1px solid #dcdfe6;
  cursor: pointer;
}
button:hover {
  background-color: #0e6ded;
}
</style>
